<template>
  <div class="apply_review_content">
    <van-divider
      v-if="isDetail"
      :style="{ color: '#323233', borderColor: '#BCBCBC', padding: '2px 80px 0', margin: '0', backgroundColor: '#FFFFFF', fontWeight: 'bolder'}"
    >
      申请的详细内容
    </van-divider>
    <div class="content_card">
      <van-row class="content_title" type="flex" justify="space-between">
        <van-col span="4" class="user_avatar">
          <van-image round cover
                     :src="itemObj.avatar"
                     width="1.5rem" height="1.5rem"
          />
        </van-col>
        <van-col span="20" class="user_nickname">
          <div style="margin-bottom: 6px; font-weight: bolder">{{itemObj.nick_name}}</div>
          <div>理想市场价：<span style="font-weight: bolder; color: red; margin-right: 6px; font-size: 15px;">{{itemObj.price}}</span>元</div>
        </van-col>
      </van-row>
      <van-row class="content_reason" type="flex" justify="space-between" >
        <van-col span="5" class="user_avatar">
          <span>申请理由：</span>
        </van-col>
        <van-col span="19" class="reason_text">
          <span>{{itemObj.reason}}</span>
        </van-col>
      </van-row>
      <van-row class="content_photo" type="flex" justify="space-between">
        <van-col span="5">
          <span>上传图片：</span>
        </van-col>
        <van-col span="19" class="content_pic">
          <van-uploader
            v-show="itemObj.imgurl"
            v-model="itemObj.imgurl && itemObj.imgurl.split('|').map(urlPath => ({url: urlPath}))"
            :deletable="false"
            :show-upload="false"
            :preview-options="{
              closeable: true,
            }"
          />
          <span v-show="!itemObj.imgurl">无</span>
        </van-col>
      </van-row>
      <van-row class="content_time" type="flex" align="center">
        <van-col span="5">
          <span>提交时间：</span>
        </van-col>
        <van-col span="19" class="apply_time">
          <van-button style="border: none; color: black; font-size: 13px"
                      plain type="info" size="mini"
          >{{itemObj.createdate}}</van-button>
          <van-button
            v-show="!isDetail"
            v-if="(auditTypeId === '1')"
            type="info" size="mini"
            style="border: none; margin-right: 6px; font-size: 13px"
            @click="toReviewApply(itemObj.id)"
          >去审核</van-button>
          <van-button
            v-show="!isDetail"
            style="border: none; font-size: 13px"
            type="info" size="mini"
            color="linear-gradient(to right, #ff6034, #ee0a24)"
            @click="goNeedAllUserAuditRecords"
          >全部审核记录</van-button>
        </van-col>
      </van-row>
    </div>
  </div>
</template>

<script>
export default {
  // auditTypeId 是否显示审核按钮
  props: ['itemObj', 'isDetail', 'auditTypeId', 'stockItem'],

  methods: {
    toReviewApply(id){
      this.$emit('openReviewForm', id)
    },

    goNeedAllUserAuditRecords(){
      console.log('全部审核记录', this.itemObj);
      this.$router.push({
        name: 'allUserAuditRecords',
        // query: params,
        query: this.itemObj
      })
    },
  }


};
</script>


<style lang="scss" scoped>
.apply_review_content{
  padding-top: 6px;
  background-color: #FFFFFF;
  .content_card{
    padding: 0 5px 0 10px;
    border-bottom: 1px solid #F7F7F7;
    font-size: 14px;
    .content_title{
      .user_avatar{
      }
      .user_nickname {
        padding: 10px 0 0 10px;
        border-bottom: 1px solid #F7F7F7;
      }
    }
    .content_reason{
      margin: 4px 0;
      .reason_text{
        border-bottom: 1px solid #F7F7F7;
        padding-bottom: 20px;
      }
    }
    .content_photo{
      padding-bottom: 1px;
      .content_pic{
        border-bottom: 1px solid #F7F7F7;
      }
    }
    .content_time{
      border-bottom: 1px solid #DEE1E6;
      padding-bottom: 4px;
      .apply_time{
        //vertical-align: center;
      }
    }
  }
  .review_content{
    border-bottom: 1px solid black;
  }
}
</style>
